<template>
  <div>
    <x-header id="header" :left-options="{backText: ''}">渠道管理</x-header>
    <div class="main-header">
      <div class="check">
        <group class="group" title="渠道来源">
          <cell class="cell" v-for="(item,index) in channelList" :key="index" :title="item.title"   >
            <img slot="icon" width="25" class="cell-icon" :src="item.choose === 1?'../../../static/img/on.png':'../../../static/img/off.png'" @click="choose(index)" />
          </cell>
        </group>
      </div>
      <div class="save">
        <x-button class="save-button" @click.native="editChannel">确认</x-button>
      </div>
    </div>
  </div>
</template>

<script>
import { editChannelSrc } from '@/api/user'
export default {
  name: 'channel',
  components: {
  },
  data () {
    return {
      channelList: [
        {
          id:0,
          title: '寿险渠道',
          choose: 1
        },
        {
          id:1,
          title: '同行渠道',
          choose: 0
        },
        {
          id:2,
          title: '入围公司',
          choose: 0
        },
        {
          id:3,
          title: '其他渠道',
          choose: 0
        },
      ],
      current: 0
    }
  },
  methods: {
    choose(index) {
      let _index = parseInt(index)
      if (_index !== this.current) {
        this.current = _index
        this.channelList = this.channelList.map( (item, itemIndex) => {
          if (_index === itemIndex) {
            item.choose = 1
          } else {
            item.choose = 0
          }
          return item
        })
      }
    },
    editChannel() {
      editChannelSrc({cid:this.globalData.cid,channelSrc:this.current }).then(() => {
        this.$vux.toast.show({
          text: '修改成功',
          type: 'success'
        })
        setTimeout(() => {
          this.$router.back(-1)
        },1500)
      })
    }
  }
}
</script >

<style scoped>

.name {
  background: #fff;
}
.check {
  margin-top: 1rem;
  overflow: auto;
  color: #4A4A4A;
  background: #fff;
}
</style>
